<template>
	<div class="base-info-content">
        <el-form ref="ruleFormRef" :model="goodsInfoData" :rules="rules" label-width="150px">
			<el-form-item label="商品推荐：">
				<el-checkbox-group v-model="goodsInfoData.recommend">
					<el-checkbox v-for="(item,index) in props.recommend" :key="item.dictId" :label="item.dictId">{{ item.dictName }}</el-checkbox>
				</el-checkbox-group>
			</el-form-item>
		</el-form>
        <section style="text-align: center; margin: 50px 0;">
            <el-button type="primary" @click="previousStep">上一步</el-button>
            <el-button type="primary" @click="nextStep">下一步</el-button>
        </section>
	</div>
</template>

<script setup lang="ts" name="funWangEditor">
import { defineAsyncComponent, reactive } from 'vue';
const emit = defineEmits(['stepChange'])
// 引入组件
import { goodsInfo } from '/@/stores/goods';
const goodsInfoData = goodsInfo()
const props = defineProps({
	recommend: {
		type: Array,
	},
});
const rules = reactive<FormRules<any>>({
	note: [{ required: true, message: '请输入商品详情', trigger: 'blur' }],
})

// 上一步
const previousStep = () => {
    emit('stepChange', 'third')
}
// 下一步
const nextStep = () => {
    emit('stepChange', 'fifth') 
}
</script>
